Data Tables: Four Major User Tasks 資料表格:四種主要使用者任務及其設計應用

資料表格是展示大量、多維度資料的常見方式,特別是在工作場景中。儘管表格設計能夠有效呈現複雜資料,但大表格往往也會帶來使用和設計上的挑戰。因此,為了最佳化表格的使用體驗,設計師需要重點關注支援以下四種主要使用者任務:查詢符合特定條件的記錄、比較資料、檢視/編輯/新增單條記錄、對記錄進行操作

資料表格 vs. 卡片或模組化展示

雖然卡片或模組化展示(如資訊圖表或資料儀表盤)在視覺上更美觀,但資料表格在展示多維度資料時具備以下明顯優勢:

基於卡片的多變數資料表示要求使用者每次將眼睛從一張卡片移動到另一張卡片時,都需要在空間上重新定位,這使得比較任務在認知上既費力又緩慢。
眼動追蹤凝檢視顯示了參與者在表格資料和上面的過濾器之間來回注視。在某一時刻,參與者對錶格進行分層搜尋,在第一列、第二列之間移動眼睛,然後跳到第四列和第六列,然後移動到下一行資料並重復該過程。

在卡片式資料展示中,使用者需要在不同卡片間反覆移動視線和記憶資訊,這增加了認知負擔。而在表格中,使用者可以輕鬆在相鄰的列或行間進行對比,提升效率。

資料表格中常見的使用者任務

儘管不同應用程式或使用者的具體任務可能有所不同,但以下四種任務通常是使用者在使用資料表格時最常見的操作:

  1. 查詢符合特定條件的記錄
  1. 比較資料
  1. 檢視、編輯或新增單條記錄
  1. 對記錄進行操作

2.1 查詢符合特定條件的記錄

在這種場景中,使用者可能希望查詢某個特定專案(如已知名稱的記錄)或多個符合特定條件的專案(如滿足某些篩選條件的記錄)。使用者可以透過過濾、排序、搜尋功能或直接視覺掃描表格內容來查詢目標。

設計要點:

2.2 比較資料

資料比較用於識別變數或記錄間關係、檢測資料範圍、發現異常值或探索變數典型情況。然而,大量資料可能導致理解困難或比對不便。

設計要點:

例如,鎖定表頭和首列、使用淺色邊框和交錯配色,可支援視覺掃描,幫助使用者在比較時準確定位。

凍結的標題行和第一列、淺色邊框和斑馬紋條帶都支援視覺掃描行為,並幫助使用者在環顧四周和比較資料時保持原位。投影的巧妙使用表明,凍結的第一列和標題行浮動在表的其餘資料“上方”,有助於空間定位
一個易於注意的選單,用於隱藏列,清楚地指示當前狀態(當前隱藏了 15 列)。可以透過兩種方式在此處對列重新排序:(1) 拖放列標題本身(其可發現性相對較低且可訪問性較差,但一旦學會,它是一個有效的加速器)或 (2) 從此可見選單中的列列表中拖放。

2.3 檢視、編輯或新增單條記錄

檢視或編輯單條記錄時,如果表格過寬,使用者需要水平滾動才能訪問所有欄位,閱讀和編輯都會變得困難。常見的設計方案包括:

用於編輯的模式彈出視窗會掩蓋表格上的資訊。

行內編輯(Edit in Place):適用於窄表格。在編輯模式下,確保行的外觀有所不同,以防使用者誤操作。

彈出視窗(Modal Popup):彈出視窗會遮擋表格的其他內容,不推薦用於深度編輯,因為使用者無法參考其他記錄的資料。

非模態側邊欄或單獨視窗:這類設計雖然會遮擋部分表格,但仍然允許使用者在編輯時檢視錶格的其他資料。

行摺疊(Accordion):展開單條記錄的詳細資訊,但使用者常常不會在操作完成後關閉摺疊欄,導致介面變得混亂,難以進行其他操作。

非模態側面板允許完整顯示(和編輯)單個記錄,同時仍允許使用者檢視錶的其餘資料。

2.4 對記錄進行操作

在表格中進行操作(如刪除、分享或傳送發票)時,可以分為兩種模式:

單條記錄操作:通常將操作按鈕放置在表格行內,如果操作項較多,可能會導致按鈕過於密集或隱藏在懸停選單中,降低可發現性。

批次操作:使用者可透過選擇多條記錄(如勾選核取方塊)來批次執行操作。設計時應考慮使用“全選”選項,便於使用者快速選擇全部資料集。

資料表格比模組化展示更高效利用空間,適合展示大量資料並便於比較。設計時應重點支援以下使用者任務:

  1. 查詢特定記錄
  1. 比較資料
  1. 檢視、編輯或新增記錄
  1. 執行操作

透過合理的列排序、資訊佈局和功能設定,可提高使用者效率和體驗。設計師應根據實際場景靈活應用這些原則。